<template>
  <div class="container">
    <el-row :gutter="8"
      style="box-sizing: border-box; position: absolute; top: 0; bottom: 0; width: 100%; overflow: auto;">
      <el-col :span="4" style=" box-sizing: border-box;">
        <div style="box-sizing: border-box;">
          <departmentTree />
        </div>
      </el-col>
      <el-col :span="20" style=" box-sizing: border-box;">
        <div style="box-sizing: border-box;">
          <userTable />
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script lang="ts" setup>
import departmentTree from "./components/departmentTree.vue"
import userTable from "./components/userTable.vue"
</script>

<style scoped>
.container {
  height: calc(100vh - 30px);
  overflow: auto;
  position: relative;
}
</style>